<template>
  <div>
    <van-tabbar fixed v-model="active" @change="onChange">
      <van-tabbar-item name="home" to="/home" icon="home-o"
        >首页</van-tabbar-item
      >
      <van-tabbar-item name="sport" to="/sport" icon="medal-o"
        >比赛</van-tabbar-item
      >
      <van-tabbar-item name="comnity" to="/comnity" icon="comment-circle-o"
        >社区</van-tabbar-item
      >
      <van-tabbar-item name="shop" to="/shop" icon="shopping-cart-o"
        >购物</van-tabbar-item
      >
      <van-tabbar-item name="user" to="/user" icon="user-o"
        >我的</van-tabbar-item
      >
    </van-tabbar>
  </div>
</template>
<script>
import { mapActions, mapState } from 'vuex'
export default {
  data () {
    return {
      active: 'home'
    }
  },
  computed: {
  },
  methods: {
    onChange (event) {
      this.active = event
    }
  }
}
</script>
<style lang="less" scoped>
</style>
